<template>
  <q-empty
    v-if="!list || !list.length"
    :text="!list ? '加载中...' : '暂无代金券'"
  ></q-empty>
  <view class="pa-3" v-else>
    <view
      class="pa-3 bg-cell bdrs-8 mb-3"
      :class="{
        'op-7': !it.avail,
      }"
      v-for="it in myList"
      :key="it.id"
      @click="onItem(it)"
    >
      <view class="al-c">
        <view class="flex-1 lh-15">
          <view class="fz-14">{{ it.name }}</view>
          <view class="fz-12 op-5">
            <span>{{ it.timeTxt }}</span>
          </view>
        </view>
        <view>
          <view class="red-1">
            <span class="fz-12">￥</span>
            <span class="fz-20">{{ it.cut_price }}</span>
          </view>
        </view>
      </view>
      <view
        class="pt-2 mt-2 u-border-top al-c"
        style="border-top-style: dashed"
      >
        <view class="fz-13 op-5">{{ it.reason }}</view>
        <view class="ml-auto pl-3" v-show="byPick">
          <span
            class="iconfont fz-18"
            :class="
              it.id == pickCoupon.id
                ? 'icon-checked color-1'
                : 'icon-uncheck op-4'
            "
          ></span>
        </view>
      </view>
    </view>

    <view class="pa-4 ta-c fz-14">
      <u-loading-icon v-if="loading == 2" />
      <span class="op-4" v-else-if="total > 6"> 共{{ total }}条记录 </span>
    </view>
    <u-safe-bottom />
  </view>
</template>

<script>
import mixin from "./list-mixin";
import mixinCart from "../order/mixin-cart";

export default {
  mixins: [mixin, mixinCart],
  computed: {
    myList() {
      return this.list
        .map((item) => {
          const row = {
            ...item,
          };
          let reason = "";
          let avail_num = 0;
          if (row.used_num >= row.total_num) {
            reason = "已使用";
            if (row.total_num > 1) reason = `已用完${row.total_num}张`;
          }
          if (this.byPick) {
            if (row.type == 0) {
              if (row.by_con > this.totalInfo.price) {
                reason = "未达到门槛金额";
              } else {
                avail_num = 1;
              }
            } else if (row.type == 1) {
              const goods = this.goodsList.find((it) => it.id == row.by_con);
              if (!goods) {
                reason = "指定商品可用";
              } else {
                avail_num = goods.num;
              }
            } else if (row.type == 2) {
              const list = this.goodsList.filter((it) => it.type == row.by_con);
              if (!list.length) {
                reason = "指定分类可用";
              } else {
                list.forEach((it) => {
                  avail_num += it.num;
                });
              }
            }
          }
          let reasons = reason ? [reason] : [];
          reason = "";
          row.timeTxt = "不限时间";
          if (row.valid_begin) {
            row.valid_begin = new Date(row.valid_begin);
            if (this.nowDate < row.valid_begin) {
              reason = "未生效";
              row.timeTxt = row.valid_begin.format() + " 生效";
            } else {
              row.isBegin = true;
            }
          }
          if (row.valid_end) {
            row.valid_end = new Date(row.valid_end);
            if (row.isBegin) {
              row.timeTxt = row.valid_end.format() + " 过期";
            }
            if (this.nowDate > row.valid_end) {
              reason = "已过期";
            }
          }
          if (reason) {
            reasons.push(reason);
          }
          row.avail = !reasons.length;
          if (!this.byPick) {
            row.reason = reason || row.note;
            if (row.total_num > 1) {
              let txt = `${row.total_num}张可用`;
              if (row.used_num) txt += `，已用${row.used_num}张`;
              row.reason += ` (${txt})`;
            }
          } else if (row.avail) {
            const restNum = row.total_num - row.used_num;
            row.avail_num = Math.min(restNum, avail_num);
            if (row.total_num > 1) {
              row.reason = `剩余${restNum}张，可用${row.avail_num}张`;
            } else {
              row.reason = "可使用";
            }
          } else {
            row.reason = reasons.join("; ");
          }
          return row;
        })
        .toSorted((a, b) => {
          if (b.avail == a.avail) {
            return a.valid_begin - b.valid_begin;
          }
          return b.avail - a.avail;
        });
    },
  },
  data() {
    return {
      listApi: "/data/auth/list/user_coupon",
      byPick: false,
    };
  },
  onLoad({ act }) {
    this.byPick = act == "pick";
    this.getList();
  },
  methods: {
    onItem(it) {
      if (!it.avail) return;
      if (!this.byPick) return;
      const cut_total = (it.cut_price * it.avail_num).toFixed(2);
      let title = it.name + "，减￥" + cut_total;
      if (it.avail_num > 1) {
        title = `[${it.avail_num}张] ` + title;
      }
      this.$setStore({
        pickCoupon: {
          ...it,
          title,
          cut_total,
        },
      });
      this.$navBack();
    },
  },
};
</script>
